<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
   <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>管理员列表</title>
<style type="text/css">
*{
 margin: 0px;
 padding: 0px;
}
#All_css{
   width: 100%;
   height:600px;
   border:solid 1px red;
}
table {
	margin-top: 20px;
	border: 1px solid #000;
	text-align: center;
}

table tr {
	height: 30px;
	font-size: 15px;
}

table tr td {
	width: 188px;
	background-color:#fff;
	border: 1px solid #000;
}
input {
	border: 0px;
    height:27px;
	text-align: center;
	width: 188px;
	
	background-color: #fff;
	
}
.do_right{
    margin-top:2px;
	width: 17px;
	height:22px;
	line-height:20px;
		cursor: pointer; 
	background: #fff url("../img/icon_priv.gif") repeat-x;
	float: left;
 	margin-left:40px;
}
.update_content {
	width: 21px;
	height:21px;
/* 	line-height: 20px;
	height: 20px;
	color: white;*/
	cursor: pointer; 
	background: #fff url("../img/icon_edit.gif") repeat-x;
	float: left;
 	margin-left:5px;
 	/*
	background-color: black;
	border: solid 1px red;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0
		rgba(0, 0, 0, 0.19); */
	text-align: center;
}
.passwordimg{
	width: 17px;
	height:21px;
/* 	line-height: 20px;
	height: 20px;
	color: white;*/
	cursor: pointer; 
	background: #fff url("../img/icon_priv.gif") repeat-x;
	float: left;
 	margin-left:5px;
 	/*
	background-color: black;
	border: solid 1px red;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0
		rgba(0, 0, 0, 0.19); */
	text-align: center;
}


.update_content_delete{
	width: 20px;
	height: 20px;
	background: #fff url("../img/icon_drop.gif") repeat-x;
/* 	line-height: 20px;
	height: 20px; */
	/* color: white;
	background-color: black;
	border: solid 2px red; */
	margin-left:5px;
	float:left;
	cursor: pointer;
}
#right_head{
    width: 100%;
    color:white;
    font-size:15px;
    height:10px;

    
}
#head_css{
   width:187px;
   height:25px;
   position:absolute;
   right:0px;
   text-align:center;
   background-position:center;
   display:table-cell;
   background-color:#4F4F4F;
   border:solid 1px gray;
   cursor: pointer;
}

.main-div{
width: 100%;
border:solid 1px red;
margin:0 auto;
}
.form_css{
   width:500px;
   height:300px;
   border:solid 1xp red;
   margin:50px auto; 
}
#table {
	border:solid 1px red;
	
}



</style>
</head>
<body>
<div id="All_css">
<div id="right_head">
   <div id="head_css"  ><img src="../img/addadmin.gif">&nbsp&nbsp添加管理员</div>
</div>
<div>
	<table cellpadding="0" cellspacing="0"  style="border-collapse:collapse;">
		<tr style="font-weight: bold;">
			<td>用户编号</td>
			<td>用户名称</td>
			<td>Email</td>
			<td>添加时间</td>
  			<td>最后登录时间</td>
			<td>操作</td>
		</tr>
		<c:forEach items="${list}" var="list">
			<tr id="tr_disabled">
			    <td><div  id="userid"  class="${list.userid }">${list.userid}</div></td>
				<td><input  id="username" type="text" value="${list.username}" /></td>
				<td><input  id="email"   type="text" value="${list.email}" /></td>
				<td>${list.addtime}</td>  
				<td>${list.lastlogin }</td>
				<td>
				<div  class="do_right" ></div>
				<div  class="update_content" id="y"></div>
				<div id="${list.userid}" class="update_content_delete" ></div>
				<div  class="passwordimg" >1</div>
				</td>
			</tr>
		</c:forEach>
	</table>
	</div>
	</div>
	<div class="main-div">
<div class="form_css" style="display:none;">
<form action="../AdminServlet?method=insertAdmin" method="post"  onsubmit="" id="from_action">
<table id="table" width="100%" align="center">
  <tr>
    <td class="label">用户名</td>
    <td>
      <input type="text" name="username" maxlength="20" value="" size="34"/><span class="require-field">*</span></td>
  </tr>
  <tr>
    <td class="label">Email</td>
    <td>
      <input type="text" name="email" value="" size="34" /><span class="require-field">*</span></td>
  </tr>
   <tr>
    <td class="label">密  码</td>
    <td>
      <input type="password" name="password" maxlength="32" size="34" id="onePassword" /><span class="require-field">*</span></td>
  </tr>
  <tr>
    <td class="label">确认密码</td>
    <td>
      <input type="password" name="pwd_confirm"  maxlength="32" size="34" id="twoPassword"  /><span class="require-field">*</span>
      <div id="div_tip" style="height:16px;font-size:12px;color: red;"></div>
      </td>
      
  </tr>
      <tr>
    <td colspan="2" align="center">
      <input type="submit" value=" 确定 " class="button" id="submit" disabled="disabled" />&nbsp;&nbsp;&nbsp;
      <input type="reset" value=" 重置 " class="button" disabled="disabled" />
      <input type="hidden" name="act" value="insert" />
      <input type="hidden" name="token" value="" />
      <input type="hidden" name="id" value="" /></td>
  </tr>
</table>
</form>
</div>
</div>

		<script type="text/javascript" src="../js/jquery-3.1.0.js"></script>
	<script type="text/javascript">
     $(function(){
    	  $("#tr_disabled td input").attr("disabled","disabled");
         $("#twoPassword").blur(function(){
        		var onep=$("#onePassword").val();
                var twop=$("#twoPassword").val();
               if (onep!=twop) {
				$("#div_tip").text("你输入的两次密码不一样");
				$("#twoPassword").keyup(function(){
					$("#div_tip").text("");
				})
			}else {
               $("#submit").attr("disabled",false);
			}
         })
    	 
    	 $("#head_css").click(function(){
    		 $("#All_css").css("display","none");
    		 $(".form_css").css("display","block");
    	 })
    	 
    	 $(".update_content_delete").click(function(){
    		 $.getJSON("../AdminServlet?method=deleteAdmin&userid="+$(this).attr("id"),{},function(data){
    			 if (data=="0") {
					alert("删除成功");
					$("#rightdiv").load("../yf/adminlist.jsp");
				}if (data=="1") {
					alert("删除失败");
				}
    		 })
    	 })
    $(".update_content").each(function () {
    	var va=null;
		$(this).click(function(){
			va=$(this).parent().parent().find("td .update_content").attr("id");
			if(va=="y"){
			$(this).parent().parent().find("td input").css({"border":"solid 2px red"});
			$(this).parent().parent().find("#addtime").attr("disabled","disabled");
		    $(this).parent().parent().find("input").removeAttr("disabled");
		    va=$(this).parent().parent().find("td .update_content").attr("id","f");
			}
			$(this).click(function(){
			if(va=="f"){
				$(this).parent().parent().find("input").css({"border":"solid 0px black"});
				$(this).parent().parent().find("input").attr("disabled",true);
		    $.getJSON("../AdminServlet?method=updataAdmin",{
		    	username:$(this).parent().parent().find("td #username").val(),
		    	email:$(this).parent().parent().find("td #email").val(),
		    	userid:$(this).parent().parent().find("td #userid").attr("class")
		    },function(data){
		    	$("#rightdiv").load("../yf/adminlist.jsp");
		    })	
		    }
			  va=$(this).parent().parent().find("td .update_content").attr("id","y");
			});
	}) 
	})
    	 
     })
     </script>
</body>
</html>